<template>
  <div id="linear" :style="linearstyle"></div>
</template>

<script>
import Bus from "@/assets/js/bus.js";

export default {
  name: "linear",
  data() {
    return {
      width: 0,
    };
  },
  methods: {
    
  },
  created() {
    Bus.$on("isscroll", (data) => {
      this.width = (data.scrolltop / data.scrolltopmax).toPrecision(2) * 100;
    });
  },
  computed: {
    linearstyle() {
      return {
        width: `${this.width}%`,
      };
    },
  },
  watch: {
   
  },
};
</script>

<style scoped>
#linear {
  background-color: white;
  height: 6px;
  position: absolute;

  top: 0px;
  left: 0px;
  z-index: 103;
  box-shadow: 1px 1px 3px black;
}
</style>